Deprecated Prizm Content Connect
Adding Code for an HTML5 Project

The HTML5 Prizm Content Connect sample demonstrates the use of a JavaScript component, pccViewer, which communicates with a web service using a RESTful scheme as noted in the RESTful Web API topic. To add the html5 viewer, the following script files are required to be added for the web page:

Along with a script (similar to the following) tying a desired document to be viewed to the pccViewer control object:

CS.NET Example
Copy Code
:
<script type="text/javascript">
 var documentName1 = '<%=document%>'
 $(document).ready(function () {
 var pluginOptions1 = { documentID: documentName1, toolboxMenuOpen: false, annotationID:
     'Annotation Filename', uiElements: { toolTips: true, fullScreenToggle: true,
      firstLastPage: false} }
 $("#imageGearPageView").pccViewer(pluginOptions1);
        });
</script>

The pluginOptions1 description can be found in the HTML5 Viewer topic.
 
The imageGearPageView object is named div object where the viewer will be anchored:

CS.NET Example
Copy Code
:
    <div id="imageGearViewer">
        <div id="imageGearPageView">
        </div>
    </div>

To set up the service web environment, either a traditional web.config file can be used or a more generic .xml file like the prizmconfig.xml used in the HTML5 sample. The prizmconfig.xml contains named tags or elements which specify where documents are obtained, where intermediate images are cached and where the imaging services, the proxyserver, can be located for its image rendering services.

XML Element

Content

Purpose

EnableDocumentPath True or False When set to True, this parameter restricts the web tier samples to load documents from the path specified by DocumentPath. Otherwise, it allows loading documents from any path.

DocumentPath

 

%ALLUSERSPROFILE%\Accusoft\Prizm\Documents

Location of document folder for displaying document images.

TempcachePath

%ALLUSERSPROFILE%\Accusoft\Prizm\Cache

Location where the proxyserver will deposit rendered images. The parameter contained within the percentage symbols, ALLUSERSPROFILE, is an environmental parameter denoting the default base path for reading and writing access.

MarkupsPath

%ALLUSERSPROFILE%\Accusoft\Prizm\Markups

Location where named annotation files are stored and retrieved.

WebServiceScheme

http

Communication protocol to the proxyserver.

WebServiceHost

localhost

Domain or host of the proxyserver.

WebServicePort

18660

Port number for proxyserver.

These elements can be changed or added to suit the environment needed by the deployed prizm application. In the HTML5 sample, the PccConfig code file is used to parse these tags and provide a property interface for each xml element.

The PccConfig code file has a static method, LoadConfig, which can be used like the following code snippet to obtain the environmental parameters to execute the web tier service of the application. The call should be made early in the web application page using the prizm services.

Example
Copy Code
<body>
:
<%
    // Environmental Setup
    PccConfig.LoadConfig("prizmconfig.xml");
%>
:
</body>

The other code file pieces needed have to do with supporting the pccViewer RESTful communication scheme to the service side Web tier and onto the proxyserver image rendering service.

File

Description

App_Code Folder

Contains the supporting classes for environmental configuration and the RESTful communication scheme between the pccViewer and web tier service. While the code body for the classes can be modified as needed, the APIs modifications need careful care if changed. See PCC.ashx.

PccViewerServices Assembly shared for both vb and c# samples. Source is in a separate directory and moves the communication backend between the web tier and imaging services (proxy server) into its own namespace and class objects. See the PccViewerServices topic section for details.

Js folder

Contains the required Javascript files making up the pccViewer entity.

Images folder

Graphics for pccViewer.

Css folder

Web style sheet for the pccViewer.

Default.aspx

The default web starting page. The pccViewer would typically reside on this page.

PCC.ashx

File which defines and links the required prizm RESTful interface to the files in the App_Code folder. The client side pccViewer Javascript object will use this RESTful interface as described in RESTful Web API. File is required for the functionality of the IIS ASP.NET environment.

Prizmconfig.xml

Contains modifiable parameter content locations for documents, cache folder and proxyserver connection.

Web.config

Contains IIS and web tier settings.

Sample.doc

For the HTML5 sample, the test document used to illustrate the functional prizm content connect product.

With all these pieces, a web application page can be put together using a query parameter to pass in the document to be viewed. The following HTML5 sample illustrates a simple web Default.aspx application solution using the document parameter for the query string to get the document to view:

CS.NET Example
Copy Code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>PCC HTML5 Sample</title>
    <link rel="icon" href="favicon.ico" type="image/x-icon" />
    <link href="Default.css" rel="stylesheet" type="text/css" />
    <script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script src="js/jquery-ui-1.8.21.custom.min.js" type="text/javascript"></script>
    <script src="js/pccViewer.js" type="text/javascript"></script>
</head>
<body>
    <form id="Form1" runat="server">
     <div id="confidentialNotice"><p>Content Connect Sample</p>
    </div>
<%
    // Environmental Setup
    PccConfig.LoadConfig("prizmconfig.xml");
   
    string document;
    document = Request.QueryString["document"];
    
    if (document == null)
    {
        Response.Write("You must include the name of a document in the URL.<br/>");
        Response.Write("For example, click on this link:
        <a href=\"Default.aspx?document=sample.doc\">Default.aspx?document=sample.doc</a>");
        return;
    }
   
    string documentLocation = PccConfig.DocumentFolder;
    string tempLocation = PccConfig.TempFolder;
    string originalDocument = System.IO.Path.Combine(documentLocation, document);
%>   
  <script type="text/javascript">
    var documentName1 = '<%=document%>'
    $(document).ready(function () {
        var pluginOptions1 = { documentID: documentName1, toolboxMenuOpen: false, annotationID: 'Annotation Filename', uiElements: { toolTips: true, fullScreenToggle: true, firstLastPage: false } }
        $("#imageGearPageView").pccViewer(pluginOptions1);
    });
  </script>
    <div id="imageGearViewer">
        <div id="imageGearPageView">
        </div>
    </div>
    </form>
</body>
</html>

 

 


©2014. Accusoft Corporation. All Rights Reserved.

Send Feedback